<template>
  <div class="worktask-designer-taskinfo-container">
    <el-dialog v-model="showDialog.order" title="合同信息" width="1000px">
      <order-input ref="orderRef" />
    </el-dialog>
    <el-dialog v-model="showDialog.product" title="业务产品信息" width="1000px">
      <product-list ref="productRef" />
    </el-dialog>
    <el-dialog v-model="showDialog.gift" title="赠品信息" width="1000px">
      <gift-list ref="giftListRef" />
    </el-dialog>
    <el-dialog v-model="showDialog.shop" title="店铺/账号信息" width="1000px">
      <shop-list ref="shopRef" />
    </el-dialog>
    <el-dialog v-model="showDialog.payment" title="收款信息" width="1000px">
      <payment-list ref="paymentRef" />
    </el-dialog>
    <el-dialog v-model="showDialog.invoicing" title="开票信息" width="1000px">
      <invoicing-list ref="invoicingListRef" />
    </el-dialog>
    <el-row :gutter="15">
      <el-col :span="6">
        <el-card shadow="hover">
          <template #header>
            <el-descriptions
              class="margin-top"
              title="客户信息"
              :column="3"
              :size="size"
              border
            >
              <template #extra>
                <el-button
                  class="card-header-tag"
                  type="success"
                  size="small"
                  @click="CustomerHandle"
                >
                  更多详情
                </el-button>
              </template>
            </el-descriptions>
          </template>
          <div>
            <!-- <p>
              <el-text style="color: #999">客户简称：</el-text>
              <el-text style="color: #333">三利毛巾</el-text>
            </p> -->
            <p>
              <el-text style="color: #999">客户全称：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.CustomerAllName }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">所属区域：</el-text>
              <el-text style="color: #333">{{ CustomerInfo.CityShow }}</el-text>
            </p>
            <p>
              <el-text style="color: #999">地址：</el-text>
              <el-text style="color: #333">{{ CustomerInfo.Address }}</el-text>
            </p>
            <p>
              <el-text style="color: #999">电话：</el-text>
              <el-text style="color: #333">{{ CustomerInfo.Telphone }}</el-text>
            </p>
            <p>
              <el-text style="color: #999">负责人：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.LegalPerson }} {{ CustomerInfo.LegalMobile }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">业务联系人：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.BusinessPerson }}
                {{ CustomerInfo.BusinessPersonMobile }}
              </el-text>
            </p>
          </div>
          <el-divider />
          <div>
            <p>
              <el-text style="color: #999">客户所在行业：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.IndustryShow }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">主营产品：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.SalesProducts }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">主要销售区域：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.SalesArea }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">主要客户群体：</el-text>
              <el-text style="color: #333">
                {{ CustomerInfo.CustomerGroup }}
              </el-text>
            </p>
          </div>
        </el-card>
        <el-card shadow="hover">
          <template #header>
            <el-descriptions
              class="margin-top"
              title="签单业务销售人员信息"
              :column="3"
              :size="size"
              border
            >
              <!-- <template #extra>
                <el-tag class="card-header-tag" type="success">
                  查看商机跟进记录
                </el-tag>
              </template> -->
            </el-descriptions>
          </template>
          <div>
            <p>
              <el-text style="color: #999">员工工号：</el-text>
              <el-text style="color: #333">{{ StaffInfo.LoginName }}</el-text>
            </p>
            <p>
              <el-text style="color: #999">部门：</el-text>
              <el-text
                v-for="(item, index) in StaffInfo.Company"
                :key="index"
                style="color: #333"
              >
                [{{ item.CompanyName }}]
              </el-text>
              <el-text
                v-for="(item, index) in StaffInfo.Department"
                :key="index"
                style="color: #333"
              >
                [{{ item.DepartmentName }}]
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">签单人姓名：</el-text>
              <el-text style="color: #333">
                {{ StaffInfo?.StaffName }} {{ StaffInfo.Mobile }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">主管：</el-text>
              <el-text style="color: #333">
                {{ StaffInfo.GroupStaff?.StaffName }}
              </el-text>
            </p>
            <p>
              <el-text style="color: #999">经理：</el-text>
              <el-text style="color: #333">
                {{ StaffInfo.ManageStaff?.StaffName }}
              </el-text>
            </p>
          </div>
        </el-card>
        <!-- <el-card shadow="hover">
          <template #header>
            <el-descriptions
              class="margin-top"
              title="合同流程进度"
              :column="3"
              :size="size"
              border
            />
          </template>
          <el-timeline style="max-width: 600px">
            <el-timeline-item
              v-for="(activity, index) in activities"
              :key="index"
              type="primary"
              :hollow="true"
              :timestamp="activity.addTime"
            >
              {{ activity.OrderFlowName }}
            </el-timeline-item>
          </el-timeline>
        </el-card> -->
      </el-col>
      <el-col :span="18">
        <el-card shadow="hover">
          <el-button type="primary" plain @click="handleShow(1)">
            查看合同信息
          </el-button>
          <el-button type="primary" plain @click="handleShow(2)">
            查看业务产品信息
          </el-button>
          <el-button type="primary" plain @click="handleShow(3)">
            查看赠品信息
          </el-button>
          <el-button type="primary" plain @click="handleShow(4)">
            查看店铺/账号信息
          </el-button>
          <el-button type="primary" plain @click="handleShow(5)">
            查看收款信息
          </el-button>
          <el-button type="primary" plain @click="handleShow(6)">
            查看开票信息
          </el-button>
        </el-card>
        <el-card shadow="hover">
          <el-descriptions
            class="margin-top"
            title="任务信息"
            :column="3"
            :size="size"
            border
          >
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <user />
                  </el-icon>
                  合同编号
                </div>
              </template>
              {{ OrderInfo.OrderCode }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <office-building />
                  </el-icon>
                  业务类型
                </div>
              </template>
              <el-tag size="small">
                {{ OrderInfo.BusinessOrderName }}
              </el-tag>
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <tickets />
                  </el-icon>
                  业务产品
                </div>
              </template>
              <div style="display: flex; align-items: center">
                {{ WorktaskInfo.ProductName }}
                <el-button
                  :type="btnType"
                  :color="
                    WorktaskInfo.OrderList?.TaskSetState == 3 ? '#626aef' : ''
                  "
                  size="small"
                  style="margin-left: 10px"
                  @click="UpTaskSetting"
                >
                  约定任务设置
                </el-button>
              </div>
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <tickets />
                  </el-icon>
                  店铺ID
                </div>
              </template>
              <el-tag v-if="WorktaskInfo.BindStoreAccount" size="small">
                <a :href="WorktaskInfo.StoreUrl" target="_blank">
                  {{ WorktaskInfo.BindStoreAccount }}
                </a>
              </el-tag>
              <el-button v-else type="danger" size="small" @click="productEdit">
                补充详情
              </el-button>
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <iphone />
                  </el-icon>
                  分单/派单人
                </div>
              </template>
              {{ WorktaskInfo.AssignStaffName }}
            </el-descriptions-item>

            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <location />
                  </el-icon>
                  接单人
                </div>
              </template>
              {{ WorktaskInfo.TaskStaffName }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <tickets />
                  </el-icon>
                  相关账密
                </div>
              </template>
              <el-tag
                v-if="WorktaskInfo.BindID != 0"
                size="small"
                style="cursor: pointer"
                @click="viewPassword(WorktaskInfo, true)"
              >
                账密查看
                <!-- {{ WorktaskInfo.StorePassword }} -->
              </el-tag>

              <el-button
                v-else
                type="primary"
                size="small"
                @click="viewPassword(WorktaskInfo, false)"
              >
                账密设置
              </el-button>
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <location />
                  </el-icon>
                  计划服务期限
                </div>
              </template>
              <div>
                {{ WorktaskInfo?.OrderList?.PlanServiceStartDate }}至
                {{ WorktaskInfo?.OrderList?.PlanServiceEndDate }}
              </div>
            </el-descriptions-item>
            <el-descriptions-item>
              <template #label>
                <div class="cell-item">
                  <el-icon :style="iconStyle">
                    <location />
                  </el-icon>
                  实际服务期限
                </div>
              </template>
              <div style="display: flex; align-items: center">
                <div>
                  {{ WorktaskInfo?.OrderList?.ServiceStartDate }}至
                  {{ WorktaskInfo?.OrderList?.ServiceEndDate }}
                </div>

                <el-button
                  type="primary"
                  size="small"
                  style="margin-left: 10px"
                  @click="realityEdit"
                >
                  设置
                </el-button>
              </div>
            </el-descriptions-item>
          </el-descriptions>
        </el-card>
        <el-card shadow="hover">
          <el-descriptions
            class="margin-top"
            title="派单"
            :column="3"
            :size="size"
            border
          />
          <operate-assign
            ref="orderAssignRef"
            :actstffpostid="20"
            @fetch-data="fetchData"
          />
        </el-card>
        <!-- 服务小记 -->
        <el-card shadow="hover">
          <el-descriptions
            class="margin-top"
            title="服务小记"
            :column="3"
            :size="size"
            border
          >
            <template #extra>
              <el-button type="success" size="small" @click="handleEdit(0, 0)">
                新增服务小记
              </el-button>
              <!-- <el-button type="primary" size="small" @click="handleMore(0, 0)">
                查看更多
              </el-button> -->
            </template>
          </el-descriptions>
          <el-table
            v-loading="listLoading"
            :data="ServiceRecordList"
            @selection-change="setSelectRows"
          >
            <el-table-column
              align="center"
              label="小记ID"
              prop="TrackID"
              show-overflow-tooltip
              width="100"
            />
            <el-table-column
              align="center"
              label="小记时间"
              prop="TrackTime"
              show-overflow-tooltip
              width="180"
            />
            <el-table-column
              align="center"
              label="服务人"
              prop="StaffName"
              show-overflow-tooltip
              width="80"
            />
            <el-table-column align="left" label="服务小记">
              <template #default="{ row }">
                <div style="font-size: 12px" v-html="row.TrackMemo" />
                <div v-if="row.NextTrackTime">
                  下次服务时间：{{ row.NextTrackTime }}
                </div>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="服务方式"
              prop="TrackTypeName"
              show-overflow-tooltip
              width="80"
            />
            <!-- <el-table-column
              align="center"
              label="附件"
              prop="recordFile"
              show-overflow-tooltip
            /> -->
            <!-- <el-table-column
              align="center"
              label="下次服务时间"
              prop="NextTrackTime"
              show-overflow-tooltip
              width="180"
            /> -->
            <!-- <el-table-column align="center" label="操作">
              <template #default="{ row }">
                <el-button size="small" @click="handleEdit(0, row)">
                  查看/修改小记
                </el-button>
              </template>
            </el-table-column> -->
          </el-table>
          <!-- <template #footer>
            <vab-query-form>
              <vab-query-form-left-panel :span="12">
                <el-space />
              </vab-query-form-left-panel>
              <vab-query-form-right-panel :span="12">
                <el-button type="primary" @click="save">
                  提交服务完结申请
                </el-button>
              </vab-query-form-right-panel>
            </vab-query-form>
          </template> -->
          <el-pagination
            background
            :current-page="queryForm.pageNo"
            :layout="layout"
            :page-size="queryForm.pageSize"
            :total="ServiceRecordTotal"
            :page-sizes="[5, 10, 20, 30, 40, 50, 100]"
            @current-change="handleCurrentChange"
            @size-change="handleSizeChange"
          />
        </el-card>
        <!-- 客满小记 -->
        <satisfaction-record
          ref="satisfactionRecordRef"
          @fetch-data="fetchData"
        />

        <!-- 店铺后台数据 -->
        <store-sevice-record
          v-if="
            queryForm.actStffPostID != 43 &&
            queryForm.actStffPostID != 44 &&
            queryForm.actStffPostID != 45
          "
          ref="StoreSeviceRecordRef"
          @fetch-data="fetchData"
        />

        <!-- 店铺异动操作 -->
        <order-changed ref="OrderChangedRef" @fetch-data="fetchData" />
      </el-col>
    </el-row>
    <service-edit ref="serviceEditRef" @fetch-data="fetchData" />
    <customer ref="customerRef" @fetch-data="fetchData" />
    <!-- 设置实际服务期限 -->
    <order-service-date ref="orderServiceDateRef" @fetch-data="fetchData" />
    <domain ref="domainRef" />
    <host ref="hostRef" />
    <server ref="serverRef" />
    <email ref="emailRef" />
    <website ref="websiteRef" />
    <StoreLink ref="storeLinkRef" />
    <!-- 约定任务设置 -->
    <AgreedTaskEdit ref="AgreedTaskEditRef" @fetch-data="fetchData" />

    <!-- 补充店铺详情 -->
    <trusteeship ref="trusteeshipRef" />
  </div>
</template>

<script>
  import { getWorkTaskSetList } from '@/api/common'
  import Trusteeship from '@/views/business/components/Trusteeship'

  import { MoreFilled } from '@element-plus/icons-vue'
  import OrderServiceDate from '@/views/business/components/OrderServiceDate'
  import SatisfactionRecord from '@/views/business/components/SatisfactionRecord'
  import OrderChanged from '@/views/business/components/OrderChanged'
  import StoreSeviceRecord from '@/views/business/components/StoreSeviceRecord'
  import {
    getOperateDetails,
    doDelete,
    getOrderTaskSetList,
  } from '@/api/storeDetails'
  import { getOrderChangeList, showPassword } from '@/api/businessOrder'
  import Domain from '@/views/business/components/Domain'
  import Host from '@/views/business/components/Host'
  import Server from '@/views/business/components/Server'
  import AgreedTaskEdit from '@/views/business/components/AgreedTaskEdit'
  import Email from '@/views/business/components/Email'
  import Website from '@/views/business/components/Website'
  import StoreLink from '@/views/business/components/StoreLink'
  import ServiceEdit from '@/views/business/components/ServiceEdit'
  import Customer from '@/views/business/components/Customer'
  import OrderInput from '@/views/business/components/OrderInput'
  import ProductList from '@/views/business/components/ProductList'
  import GiftList from '@/views/business/components/GiftList'
  import ShopList from '@/views/business/components/ShopList'
  import PaymentList from '@/views/business/components/PaymentList'
  import InvoicingList from '@/views/business/components/InvoicingList'
  import OperateAssign from './components/OperateAssign'
  import { Delete, Plus, Search } from '@element-plus/icons-vue'
  export default defineComponent({
    name: 'SatisfactionServiceOperate',
    components: {
      AgreedTaskEdit,
      Trusteeship,
      OrderServiceDate,
      SatisfactionRecord,
      StoreSeviceRecord,
      OrderChanged,
      StoreLink,
      Domain,
      Host,
      Server,
      Email,
      Website,
      OrderInput,
      Customer,
      ProductList,
      GiftList,
      ShopList,
      PaymentList,
      InvoicingList,
      ServiceEdit,
      OperateAssign,
    },
    setup() {
      const route = useRoute()
      const $baseConfirm = inject('$baseConfirm')
      const $baseMessage = inject('$baseMessage')

      const state = reactive({
        btnType: '',
        TaskSettingList: [],
        TaskSetting: true,
        trusteeshipRef: null,
        isIcon: MoreFilled,
        activities: [],
        AgreedTaskEditRef: null,
        OrderChangedRef: null,
        orderServiceDateRef: null,
        satisfactionRecordRef: null,
        OrderChangeList: [],
        storeLinkRef: null,
        websiteRef: null,
        emailRef: null,
        hostRef: null,
        serverRef: null,
        domainRef: null,
        customerRef: null,
        SeviceDates: '',
        orderRef: null,
        productRef: null,
        giftListRef: null,
        shopRef: null,
        paymentRef: null,
        invoicingListRef: null,
        serviceEditRef: null,
        listLoading: true,
        StoreSeviceRecordRef: null,
        orderAssignRef: null,
        layout: 'total, sizes, prev, pager, next, jumper',
        selectRows: '',
        queryForm: {
          actStffPostID: 0,
          OrderID: 0,
          pageNo: 1,
          pageSize: 5,
          title: '',
        },
        OrderInfo: {},
        ProductList: [],
        WorktaskInfo: {},
        Worktasks: [],
        ServiceRecordList: [],
        ServiceRecordTotal: 0,
        CustomerSatisfactionRecordList: [],
        StoreSeviceRecordList: [],
        StoreActLog: [],
        CustomerInfo: {},
        StaffInfo: {},
        showDialog: {
          order: false,
          product: false,
          gift: false,
          shop: false,
          payment: false,
          invoicing: false,
        },
      })

      const viewPassword = async (row, disabled) => {
        console.log('shopLinkForm', row)
        const businessClass = row.OrderList.BusinessClassID
        // state.BusinessClassID = row.BusinessClassID
        switch (businessClass) {
          case 1:
            if (row.BindID != 0) {
              if (await open()) {
                state.storeLinkRef.showEdit(row, true, disabled)
              }
            } else {
              state.storeLinkRef.showEdit(row, false, disabled)
            }
            break
          case 2:
            if (row.BindID != 0) {
              if (await open()) {
                state.storeLinkRef.showEdit(row, true, disabled)
              }
            } else {
              state.storeLinkRef.showEdit(row, false, disabled)
            }
            break
          case 3:
            if (row.BindID != 0) {
              if (await open()) {
                state.storeLinkRef.showEdit(row, true, disabled)
              }
            } else {
              state.storeLinkRef.showEdit(row, false, disabled)
            }
            break
          case 4:
            if (row.BindID != 0) {
              if (await open()) {
                state.storeLinkRef.showEdit(row, true, disabled)
              }
            } else {
              state.storeLinkRef.showEdit(row, false, disabled)
            }
            break
          case 5:
            if (row.OrderList.ProductID == 63) {
              if (row.BindID != 0) {
                if (await open()) {
                  state.domainRef.showEdit(row, true, disabled)
                }
              } else {
                state.domainRef.showEdit(row, false, disabled)
              }
            } else if (row.OrderList.ProductID == 64) {
              if (row.BindID != 0) {
                if (await open()) {
                  state.hostRef.showEdit(row, true, disabled)
                }
              } else {
                state.hostRef.showEdit(row, false, disabled)
              }
            } else if (row.OrderList.ProductID == 65) {
              if (row.BindID != 0) {
                if (await open()) {
                  state.serverRef.showEdit(row, true, disabled)
                }
              } else {
                state.serverRef.showEdit(row, false, disabled)
              }
            } else if (row.OrderList.ProductID == 67) {
              if (row.BindID != 0) {
                if (await open()) {
                  state.emailRef.showEdit(row, true, disabled)
                }
              } else {
                state.emailRef.showEdit(row, false, disabled)
              }
            } else if (
              row.OrderList.ProductID == 68 ||
              row.OrderList.ProductID == 69 ||
              row.OrderList.ProductID == 70 ||
              row.OrderList.ProductID == 107 ||
              row.OrderList.ProductID == 108
            ) {
              if (row.BindID != 0) {
                if (await open()) {
                  state.websiteRef.showEdit(row, true, disabled)
                }
              } else {
                state.websiteRef.showEdit(row, false, disabled)
              }
            } else {
              if (row.BindID != 0) {
                if (await open()) {
                  state.storeLinkRef.showEdit(row, true, disabled)
                }
              } else {
                state.storeLinkRef.showEdit(row, false, disabled)
              }
            }
            break
          default:
            if (row.BindID != 0) {
              if (await open()) {
                state.storeLinkRef.showEdit(row, true, disabled)
              }
            } else {
              state.storeLinkRef.showEdit(row, false, disabled)
            }
        }
        // 域名的63
        // state.domainRef.showEdit(row)
        // 主机的64
        // state.hostRef.showEdit(row)
        // 邮箱的67
        // state.emailRef.showEdit(row)
        // 网站 68,69,70,107.108
        // state.websiteRef.showEdit(row)
      }

      const open = async () => {
        let flag
        await ElMessageBox.prompt('请输入密码', '', {
          confirmButtonText: '确认',
          cancelButtonText: '关闭',
        })
          .then(async ({ value }) => {
            const dataMsg = {
              StoreID: state.WorktaskInfo.StoreID,
              ShowPassword: value,
            }
            const { data } = await showPassword(dataMsg)
            console.log(data, typeof data)

            if (data) {
              flag = true
            } else {
              flag = false
              ElMessage({
                type: 'warning',
                message: `密码输入错误`,
              })
            }
          })
          .catch(() => {
            flag = false
          })
        return flag
      }

      const setSelectRows = (val) => {
        state.selectRows = val
      }
      const inputPassword = async (value) => {
        const dataMsg = {
          StoreID: state.WorktaskInfo.StoreID,
          ShowPassword: value,
        }
        const { data } = await showPassword(dataMsg)
        if (data == 'false') {
          return false
        } else {
          return true
        }
      }
      // 服务小记
      const handleEdit = (n, row) => {
        if (n == 0 && row == 0) {
          row = {
            OrderID: state.OrderInfo.OrderID,
            TrackClass: 1,
            TrackID: 0,
          }
        }

        // 服务小记
        if (n == 0) state.serviceEditRef.showEdit(row)
      }
      const handleDelete = (row) => {
        if (row.id) {
          $baseConfirm('你确定要删除当前项吗', null, async () => {
            const { msg } = await doDelete({ ids: row.id })
            $baseMessage(msg, 'success', 'vab-hey-message-success')
            await fetchData()
          })
        } else {
          if (state.selectRows.length > 0) {
            const ids = state.selectRows.map((item) => item.id).join()
            $baseConfirm('你确定要删除选中项吗', null, async () => {
              const { msg } = await doDelete({ ids })
              $baseMessage(msg, 'success', 'vab-hey-message-success')
              await fetchData()
            })
          } else {
            $baseMessage('未选中任何行', 'error', 'vab-hey-message-error')
          }
        }
      }

      const handleShow = (t) => {
        if (t == 1) {
          state.showDialog.order = true
          nextTick(() => {
            state.orderRef.showOrder(state.OrderInfo)
          })
        }
        if (t == 2) {
          state.showDialog.product = true
          nextTick(() => {
            state.productRef.showList(state.OrderInfo, state.ProductList)
          })
        }
        if (t == 3) {
          state.showDialog.gift = true
          nextTick(() => {
            state.giftListRef.showList(state.OrderInfo, state.GiftList)
          })
        }
        if (t == 4) {
          state.showDialog.shop = true
          nextTick(() => {
            state.shopRef.showList(state.OrderInfo, state.StoreList)
          })
        }
        if (t == 5) {
          state.showDialog.payment = true
          nextTick(() => {
            state.paymentRef.showList(state.OrderInfo, state.PaymentList)
          })
        }
        if (t == 6) {
          state.showDialog.invoicing = true
          nextTick(() => {
            state.invoicingListRef.showList(
              state.OrderInfo,
              state.InvoicingList
            )
          })
        }
      }

      const CustomerHandle = () => {
        state.customerRef.showEdit(state.CustomerInfo)
      }
      const fetchData = async () => {
        state.listLoading = true
        const {
          data: {
            OrderFlow,
            OrderInfo,
            ProductList,
            GiftList,
            StoreList,
            PaymentList,
            InvoicingList,
            WorktaskInfo,
            Worktasks,
            ServiceRecordList,
            ServiceRecordTotal,
            StoreSeviceRecordList,
            CustomerSatisfactionRecordList,
            StoreActLog,
            CustomerInfo,
            StaffInfo,
          },
        } = await getOperateDetails(state.queryForm)
        state.activities = OrderFlow
        state.OrderInfo = OrderInfo

        if (WorktaskInfo.OrderList?.TaskSetState == 0) {
          state.btnType = 'danger'
        } else if (
          WorktaskInfo.OrderList?.TaskSetState == 1 ||
          WorktaskInfo.OrderList?.TaskSetState == -3
        ) {
          state.btnType = 'warning'
        } else if (WorktaskInfo.OrderList?.TaskSetState == 2) {
          state.btnType = 'success'
        } else if (WorktaskInfo.OrderList?.TaskSetState == -1) {
          state.btnType = 'info'
        }

        state.OrderChangedRef.showList(ProductList, GiftList, 2)

        state.ProductList = ProductList
        state.GiftList = GiftList
        state.StoreList = StoreList
        state.PaymentList = PaymentList
        state.InvoicingList = InvoicingList
        state.CustomerSatisfactionRecordList = CustomerSatisfactionRecordList
        state.WorktaskInfo = WorktaskInfo
        state.Worktasks = Worktasks
        state.ServiceRecordList = ServiceRecordList
        state.ServiceRecordTotal = ServiceRecordTotal
        state.StoreSeviceRecordList = StoreSeviceRecordList
        state.StoreActLog = StoreActLog
        state.CustomerInfo = CustomerInfo
        state.StaffInfo = StaffInfo
        state.ServiceRecordList = ServiceRecordList
        getTaskSettingList()
        // 客满小记
        const addAuth = true
        state.satisfactionRecordRef.showList(
          OrderInfo,
          CustomerSatisfactionRecordList,
          addAuth
        )
        // 店铺后台数据
        if (
          state.queryForm.actStffPostID != 43 &&
          state.queryForm.actStffPostID != 44 &&
          state.queryForm.actStffPostID != 45
        ) {
          state.StoreSeviceRecordRef.showList(OrderInfo, StoreSeviceRecordList)
        }
        state.orderAssignRef.showList(
          OrderInfo,
          Worktasks,
          WorktaskInfo,
          GiftList
        )
        getOrderChanges()
        state.listLoading = false
      }
      const getOrderChanges = async () => {
        const { data } = await getOrderChangeList(state.queryForm)
        state.OrderChangeList = data
      }
      onMounted(() => {
        state.queryForm.OrderID = route.query.OrderID
        state.queryForm.WorkTaskID = route.query.WorkTaskID
        if (route.query.actstaffpostid) {
          state.queryForm.actStffPostID = route.query.actstaffpostid
        }
        fetchData()
      })

      const productEdit = (row) => {
        console.log(row, '123')
        state.WorktaskInfo.CustomerID = state.CustomerInfo.CustomerID
        state.trusteeshipRef.showEdit(state.WorktaskInfo, 1)
      }

      watch(route, (newVal, oldValue) => {
        console.log(newVal, oldValue, '12312312')
        if (newVal.query.OrderID) {
          state.queryForm.OrderID = route.query.OrderID
          state.queryForm.WorkTaskID = route.query.WorkTaskID
          fetchData()
        }
        fetchData()
      })

      // 设置实际服务时间
      const realityEdit = () => {
        state.SeviceDates = [
          state.WorktaskInfo.OrderList.ServiceStartDate,
          state.WorktaskInfo.OrderList.ServiceEndDate,
        ]
        state.orderServiceDateRef.showEdit(
          state.WorktaskInfo,
          state.SeviceDates
        )
        console.log(state.SeviceDates, '实际服务时间')
      }

      const getTaskSettingList = async () => {
        const dataMsg = {
          OrderListID: state.WorktaskInfo.OrderListID,
        }
        const {
          data: { OrderTaskSetList },
        } = await getOrderTaskSetList(dataMsg)
        if (OrderTaskSetList.length == 0) {
          state.TaskSetting = false
          getList()
        } else {
          state.TaskSetting = true

          state.TaskSettingList = OrderTaskSetList
        }
        console.log(OrderTaskSetList, '222')
      }
      const getList = async () => {
        const dataMsg = {
          ProductID: state.WorktaskInfo.OrderList.ProductID,
          ProductClassID: state.WorktaskInfo.OrderList.ProductClassID,
        }
        const {
          data: { WorkTaskSetList },
        } = await getWorkTaskSetList(dataMsg)
        state.TaskSettingList = WorkTaskSetList
      }

      const UpTaskSetting = () => {
        state.AgreedTaskEditRef.showEdit(state.WorktaskInfo, '')
        console.log('开启任务设置弹窗')
      }

      const handleSizeChange = (val) => {
        state.queryForm.pageSize = val
        fetchData()
      }
      const handleCurrentChange = (val) => {
        state.queryForm.pageNo = val
        fetchData()
      }

      provide('rootMethods', { fetchData })

      return {
        ...toRefs(state),
        setSelectRows,
        getTaskSettingList,
        getList,
        handleEdit,
        open,
        UpTaskSetting,
        handleDelete,
        productEdit,
        getOrderChanges,
        realityEdit,
        viewPassword,
        inputPassword,
        CustomerHandle,
        handleShow,
        fetchData,
        handleCurrentChange,
        handleSizeChange,
        Delete,
        Plus,
        Search,
      }
    },
  })
</script>
